<!DOCTYPE html>
<script>
    onload = function() { document.scrollingElement.scrollLeft = 150 - 10; }
</script>
<style>
    body { margin:10px; }
</style>

<p style="position:fixed; top:0;">Below there should be a green square with a black border, and no red.</p>
<div style="margin-top:5em;">
    <div style="float:right; width:0;">
        <div style="width:100px; height:100px; margin-left:50px; box-sizing:border-box; border:3px solid black; background:green;"></div>
    </div>
    <div style="padding-left:50px; width:200%; height:1px;"></div> <!-- set scroll area -->
</div>
